<!doctype html>
<html xmlns:th="http://www.thymeleaf.org" class="x-admin-sm">
<head>
	<title>后台登录-X-admin2.2</title>
    <th:block th:replace="component/head :: layui-head"/>
    <link rel="stylesheet" th:href="@{/static/css/login.css}">
</head>
<body class="login-bg">

    <div class="login layui-anim layui-anim-up">
        <div class="message">x-admin2.0-管理登录</div>
        <div id="darkbannerwrap"></div>

        <form method="post" class="layui-form" >
            <input name="username" placeholder="用户名"  type="text" lay-verify="username" lay-verType="tips" class="layui-input" >
            <hr class="hr15">
            <input name="password" lay-verify="required" placeholder="密码" lay-verType="tips"  type="password" class="layui-input">
            <hr class="hr15">
            <input name="code" lay-verify="required" placeholder="验证码" lay-verType="tips"  type="text" class="layui-input">
            <img class="img-code" src="/code/image?width=100" id="imgCode">
            <hr class="hr15">
            <input value="登录" lay-submit lay-filter="login" style="width:100%;" type="submit">
            <hr class="hr20" >
        </form>
    </div>

    <script>
        layui.use(['form','notice'], function(){
            let form = layui.form;
            let notice = layui.notice;

            form.verify({
                username: function (value,item){
                    if(!value){
                        return "用户名不能为空"
                    }
                    if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){
                        return '用户名不能有特殊字符';
                    }
                    if(/(^\_)|(\__)|(\_+$)/.test(value)){
                        return '用户名首尾不能出现下划线\'_\'';
                    }
                    if(/^\d+\d+\d$/.test(value)){
                        return '用户名不能全为数字';
                    }
                    if(common.wordCount(value)<4 || common.wordCount(value)>10){
                        return "用户名为4~10个字"
                    }
                },
                password:function (value,item){
                    if(!new RegExp("/^[\\S]{6,12}$/").test(value)){
                        return '密码必须6到12位，且不能出现空格';
                    }
                }
            });

           layui.$('#imgCode').on("click",function (){
               $(this).attr("src","/code/image?width=100&t="+new Date().getDate())
           });

            form.on('submit(login)', function(data){
                let load = layer.load(2);
                let params = data.field;

                $.ajax({
                    url: CONTEXT_PATH + '/login/form',
                    type: 'post',
                    data: params,
                    success:function (res){
                        console.info(res);
                        window.location.href=CONTEXT_PATH
                        layer.close(load);
                    },
                    error:function (error){
                        console.error(error);
                        let errorData = error.responseJSON;
                        notice.error(errorData.message);
                        layer.close(load);
                    }
                });
                return false;
            });
        });
    </script>
</body>
</html>
